<%@ page language="java" pageEncoding="utf-8"
	contentType="text/html; charset=utf-8"%>
<%@ include file="../include/taglib.jsp"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>新增订单</title>
		<%@ include file="../include/jsCss.jsp"%>
		<script type="text/javascript" src="${webUrl}/js/My97DatePicker/WdatePicker.js"></script>
		<style>
			.spanMsg {
				color: red;
			}
		</style>
	</head>

	<body>
		<form action="order!orderSaveOrUpdate.html"  method="post" id="preferentialForm" onsubmit="return addOrderVal();">
			<table border="1"> 
				<tr>
					<td colspan="2">
						新增订单
					</td>
				</tr>
				<tr>
					<td>
						姓名
					</td>
					<td>
						<input type="text" name="name" id="name" value="${orderDto.name }" onblur="javascript:onNameMsg();"/>
						<span id="nameMsg" class="spanMsg"></span>
						<input type="hidden" name="orderId" value="${orderDto.orderId }"/>
					</td>
				</tr>
				<tr>
					<td>联系方式</td>
					<td>
						<input type="text" name="contact" value="${orderDto.contact}" onblur="javascript:onContactMsg();"/>
						<span id="contactMsg" class="spanMsg"></span>
					</td>
				</tr>
				<tr>
					<td>
						选择包厢
					</td>
					<td>
						<select name="boxId">
							<option value="">无</option>
							<s:iterator value="boxList">
								<s:if test="id == orderDto.boxId">
									<option value="${id}" selected="selected">${name}</option>
								</s:if>
								<s:else>
									<option value="${id}">${name}</option>
								</s:else>
							</s:iterator>
						</select>
						
					</td>
				</tr>
				<tr>
					<td colspan="2">
						<a href="javascript:;" onclick="orderDetailPages2();">选择优惠套餐</a>
					</td>
				</tr>
				<tr id="preferentialTrId2" style="display: none;">
					<td>
						优惠套餐
					</td>
					<td>
						<div id="preferentialPackages2"></div>
						<a href="javascript:;" onclick="editOrderDetailPages2();">编辑</a>
						<input type="hidden" name="packageRemark" id="packageRemark"/>
						<input type="hidden" name="mealMenuId" id="mealMenuId"/>
					</td>
				</tr>
				<tr>
					<td colspan="2">
						<a href="javascript:;" onclick="orderDetailPages();">选择菜肴</a>
					</td>
				</tr>
				<tr id="preferentialTrId" style="display: none;">
					<td>
						点菜信息
					</td>
					<td>
						<div id="preferentialPackages"></div>
						<a href="javascript:;" onclick="editOrderDetailPages();">编辑</a>
						<input type="hidden" name="packageRemark" id="packageRemark"/>
						<input type="hidden" name="mealMenuId" id="mealMenuId"/>
					</td>
				</tr>
				<tr>
					<td>
						人数
					</td>
					<td>
						<input type="text" name="peopleNum" value="${orderDto.peopleNum }" onblur="javascript:onPeopleNum();"/>
						<span id="peopleMsg" class="spanMsg"></span>
					</td>
				</tr>
				<tr>
					<td>
						就餐时间
					</td>
					<td>
						<input type="textbox" size="18" onClick="WdatePicker();" name="repastDate" value="${orderDto.repastDate}" onFocus="WdatePicker({startDate:'00:00:00',dateFmt:'yyyy-MM-dd HH:mm:ss',alwaysUseStartDate:true})" onblur="javascript:onTime();"/>
						<span id="timeMsg" class="spanMsg"></span>
						<!--  <input type="text" name="repastDate" value=""/>-->
					</td>
				</tr>
				 
				<tr>
					<td colspan="2">
						<input type="submit"  value="提交"/>
						&nbsp;&nbsp;
						<input type="reset" value="重置" />
					</td>
				</tr>
			</table>
		</form>
		<div id="pageAllCover" style="overflow: hidden; width: 100%; height: 100%; border: 0px none; padding: 0px; margin: 0px; top: 0px; left: 0px; display: none; visibility: visible; background-color: rgb(255, 255, 255); opacity: 0.5; position: fixed; z-index: 100;"></div>
		
		
		<div id="optiontransferselectId2" style="top: 20%; left: 30%; display: none; visibility: visible; position: absolute; z-index: 1000;background: white;" >
				<s:optiontransferselect name="leftPreferential" list="#request.leftPreferentialList"
								listKey="id" listValue="name" doubleList="#request.rightPreferentialList" doubleName="rightPreferential"
								doubleListKey="id" doubleListValue="name" addToLeftLabel="删除套餐"
								addAllToRightLabel="添加全部套餐" addAllToLeftLabel="删除全部套餐"
								addToRightLabel="添加套餐"></s:optiontransferselect>
				<input type="button" onclick="addOrderDetail2()" value="提交"/> 
				<input type="button" onclick="closeOrderDetail2()" value="关闭"/>
		</div>
		
		<div id="optiontransferselectId" style="top: 20%; left: 30%; display: none; visibility: visible; position: absolute; z-index: 1000;background: white;" >
				<s:optiontransferselect name="left" list="#request.leftList"
								listKey="id" listValue="menuName" doubleList="rightList" doubleName="right"
								doubleListKey="id" doubleListValue="menuName" addToLeftLabel="删除菜肴"
								addAllToRightLabel="添加全部菜肴" addAllToLeftLabel="删除全部菜肴"
								addToRightLabel="添加菜肴"></s:optiontransferselect>
				<input type="button" onclick="addOrderDetail()" value="提交"/> 
				<input type="button" onclick="closeOrderDetail()" value="关闭"/>
		</div>
		
		<script>
		
		function addOrderVal(){
			var nameStr = $("input[name='name']").val();
			var contactStr = $("input[name='contact']").val();
			var peopleNum = $("input[name='peopleNum']").val();
			
			//姓名
			if($.trim(nameStr) == ''){
				$("#nameMsg").show();
     			$("#nameMsg").text("请输入姓名");
     			return false;
			}else{
				$("#nameMsg").hide();
			}
			
			//联系方式
			if($.trim(contactStr) == ''){
				$("#contactMsg").show();
     			$("#contactMsg").text("请输入联系方式");
     			return false;
			}else{
				$("#contactMsg").hide();
			}
			
			//人数
			if($.trim(peopleNum) == ''){
				$("#peopleMsg").show();
     			$("#peopleMsg").text("请输入人数");
     			return false;
			}else{
				if(isNaN($.trim(peopleNum))){
					$("#peopleMsg").show();
	     			$("#peopleMsg").text("请输入数字");
	     			return false;
				}else{
					$("#peopleMsg").hide();
				}
			}
			
			return true;
		}
			//姓名
			function onNameMsg(){
				var nameStr = $("input[name='name']").val();
				
				if($.trim(nameStr) == ''){
					$("#nameMsg").show();
	     			$("#nameMsg").text("请输入姓名");
	     			return false;
				}else{
					$("#nameMsg").hide();
				}
			}
			
			//联系方式
			function onContactMsg(){
				var contactStr = $("input[name='contact']").val();
				
				if($.trim(contactStr) == ''){
					$("#contactMsg").show();
	     			$("#contactMsg").text("请输入联系方式");
	     			return false;
				}else{
					$("#contactMsg").hide();
				}
			}
			
			//人数
			function onPeopleNum(){
				var peopleNum = $("input[name='peopleNum']").val();
				
				if($.trim(peopleNum) == ''){
					$("#peopleMsg").show();
	     			$("#peopleMsg").text("请输入人数");
	     			return false;
				}else{
					if(isNaN($.trim(peopleNum))){
						$("#peopleMsg").show();
		     			$("#peopleMsg").text("请输入数字");
		     			return false;
					}else{
						$("#peopleMsg").hide();
					}
				}
			}
			
			function onTime(){
				var repastDate = $("input[name='repastDate']");
				
				if($.trim(repastDate) == ''){
					$("#timeMsg").show();
	     			$("#timeMsg").text("请输入就餐时间");
	     			return false;
				}else{
					$("#timeMsg").hide();
				}
			}
			
			
			function closeOrderDetail() {
				$("#pageAllCover").css("display","none");
				$("#optiontransferselectId").css("display","none");
			}
			
			function editOrderDetailPages() {
				$("#optiontransferselectId").css("display","block");
			}
			function orderDetailPages() {
				$("#optiontransferselectId").css("display","block");
			}
			
			function addOrderDetail() {
				var rightLength = document.getElementById('right').options;
				var addHtml = "<table border='1' ><tr><td>菜肴名称</td><td>价格</td><td>份数</td></tr>";
				var orderDetailInfo = "";
				for (var k = 0;k < rightLength.length;k++) {
					<s:iterator value="orderVoList">  
						if (rightLength[k].value == ${id} && '${type}' == '0') {  
							orderDetailInfo += '${id}' + "-" + '${name}' + "-" + '${price}' + "-" + '${num}' + ",";
							addHtml += "<tr><td>${name} </td> <td>${price}</td><td><input type='text' size='5' name='num' alt='${id}' value='${num}' onkeyup='updateOrderDetailPrice(${id},this)'/></td></tr>";
						} 
					</s:iterator> 
				}
				addHtml += "</table>";
				$("#preferentialPackages").html(addHtml);
				orderDetailInfo = orderDetailInfo.substring(0, orderDetailInfo.length-1);
				$.ajax({
			           type: "POST",
			           url: "order!orderDetailMealMenuAdd.html", 
			           data: "orderDetailInfo="+orderDetailInfo+"&date="+ new Date(),
			           success: function(data)
			           {
			           		if (data == 0) { 
								$("#pageAllCover").css("display","none");
								$("#optiontransferselectId").css("display","none");
								$("#preferentialTrId").css("display","block");
			           		} else {
			           			alert("提交失败");
			           		}
			           }
			    });
			} 
			 function updateOrderDetailPrice(id,t) {
				$.ajax({
			           type: "POST",
			           url: "order!updateOrderDetailMealMenuPrice.html", 
			           data: "mealMenuId="+id+"&num="+t.value+"&date="+ new Date(),
			           success: function(data)
			           {
			           		if (data == -1) {  
			           			alert("修改失败");
			           		}
			           }
			    });
			}
			$("#optiontransferselectId table").attr("border","1");
		</script>
		
		<script>
			function closeOrderDetail2() {
				$("#pageAllCover").css("display","none");
				$("#optiontransferselectId2").css("display","none");
			}
			
			function editOrderDetailPages2() {
				$("#optiontransferselectId2").css("display","block");
			}
			function orderDetailPages2() {
				$("#optiontransferselectId2").css("display","block");
			}
			
			function addOrderDetail2() {
				var rightLength = document.getElementById('rightPreferential').options;
				var addHtml = "<table border='1' ><tr><td>套餐名称</td><td>原始价格</td><td>优惠价格</td><td>份数</td></tr>";
				var orderDetailInfo = "";
				
				for (var k = 0;k < rightLength.length;k++) {
				
					<s:iterator value="orderVoList">
						
						if (rightLength[k].value == ${id} && '${type}' == '1') {
							orderDetailInfo += '${id}' + "-" + '${name}' + "-" + '${preferentialPrice}' + "-" + '${num}' + ",";
							addHtml += "<tr><td>${name} </td> <td>${price}</td><td>${preferentialPrice}</td><td><input type='text' size='5' name='num' alt='${id}' value='${num}' onkeyup='updateOrderDetailPrice2(${id},this)'/></td></tr>";
						} 
					</s:iterator> 
				}
				addHtml += "</table>";
				$("#preferentialPackages2").html(addHtml);
				orderDetailInfo = orderDetailInfo.substring(0, orderDetailInfo.length-1);
				
				$.ajax({
			           type: "POST",
			           url: "order!orderDetailPreferentialAdd.html", 
			           data: "orderDetailInfo="+orderDetailInfo+"&date="+ new Date(),
			           success: function(data)
			           {
			           		if (data == 0) { 
								$("#pageAllCover").css("display","none");
								$("#optiontransferselectId2").css("display","none");
								$("#preferentialTrId2").css("display","block");
			           		} else {
			           			alert("提交失败");
			           		}
			           }
			    });
			} 
			
			function updateOrderDetailPrice2(id,t) {
				$.ajax({
			           type: "POST",
			           url: "order!updateOrderDetailPreferentialPrice.html", 
			           data: "mealMenuId="+id+"&num="+t.value+"&date="+ new Date(),
			           success: function(data)
			           {
			           		if (data == -1) {  
			           			alert("修改失败");
			           		}
			           }
			    });
			}
			<s:if test="orderDto.orderId != null && orderDto.orderId != ''">
				addOrderDetail2();
				addOrderDetail();
			</s:if>
			$("#optiontransferselectId2 table").attr("border","1");
		</script>
	</body>
</html>